<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0,maximum-scale=1.0,user-scalible=no">
    <link rel="stylesheet" href="../css/index.css">
    <title>团购首页</title>
</head>
<body>
    <!-- 头部 -->
    <header>
        <!-- 头部内容 -->
        <div class="h_top">
            <!-- logo -->
            <img src="../image/index/logo.png" alt="">
            <!-- 搜索框 -->
            <div class="inp"> 
                <input type="text" placeholder="请输入商品名称">
            </div>

            <!-- 地区 -->
            <div class="sel">
                <select name="">
                    <option value="广州市">广州市</option>
                    <option value="深圳市">深圳市</option>
                    <option value="上海市">上海市</option>
                </select>
            </div>
            </div>


        <!-- 轮播图 -->
        <div class="h_bt">
            <ul>
                <li><img src="../image/index/banner.png" alt=""></li>
                <li><img src="../image/index/banner.png" alt=""></li>
                <li><img src="../image/index/banner.png" alt=""></li>
            </ul>

            <!-- 轮播图进度条 -->
            <div class="bar">
                <div></div>
            </div>
        </div>

    </header>
    <!-- 主要内容 -->
    <main>
        <div class="content">
            <div class="youhui">
                <div>
                    <img src="../image/index/tuangou.png" alt="">
                    <span>优惠团购</span>
                </div>
                <div>
                    <a href="xiangxiye.html">更多</a>
                    <img src="../image/index/gengduo.png" alt="">
                </div>
            </div>
            <div class="lnk">
                <div class="lnk_top">
                    <a href=""><img src="../image/index/youhui1.png" alt=""></a>
                    <a href=""><img src="../image/index/youhui2.png" alt=""></a>
                </div>
                <div class="lnk_bt">
                    <a href=""><img src="../image/index/youhui3.png" alt=""></a>
                    <a href=""><img src="../image/index/youhui4.png" alt=""></a>
                </div>
            </div>

            <div class="xihuan">
                <div>
                    <img src="../image/index/shoucang.png" alt="">
                    <span>猜你喜欢</span>
                </div>
                <div>
                    <span>更多</span>
                    <img src="../image/index/gengduo.png" alt="">
                </div>
            </div>

            <div class="chide">
                <div class="chide_top">
                    <img src="../image/index/xihuan1.png" alt="">
                    <div class="box1">
                        <div>
                            <a>万岁寿司(正佳店)</a>
                            <span>&lt;100m</span>
                        </div>
                        <p>[100店通用]双人套餐</p>
                        <div>
                            <span>￥88.00</span>
                            <span>已售1000</span>
                        </div>
                    </div>
                </div>
                <div class="chide_bt">
                    <img src="../image/index/xihuan2.png" alt="">
                    <div  class="box2">
                        <div>
                            <a>周黑鸭(正佳店)</a>
                            <span>&lt;100m</span>
                        </div>
                        <p>[100店通用]双人套餐</p>
                        <div>
                            <span>￥88.00</span>
                            <span>已售1000</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>

            
    </main>
    <!-- 底部导航栏 -->
    <nav>
        <div class="bt_box">
            <div>
                <a href="index.html">
                    <img src="../image/index/shouye.png" alt="">
                    首页
                </a>
            </div>
            <div>
                <a href="fenlei.html">
                    <img src="../image/index/dibu2.png" alt="">
                    分类
                </a>
            </div>
            <div>
                <a href="faxian.html">
                    <img src="../image/index/dibu3.png" alt="">
                    发现
                </a>
            </div>
            <div>
                <a href="wode.html">
                    <img src="../image/index/dibu4.png" alt="">
                    我的
                </a>
            </div>
        </div>
    </nav>
</body>
</html>